<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sf" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<script type="application/javascript" >
  $(function(){
    $("head").append("<link>");
    css = $("head").children(":last");
    css.attr({
      rel: "stylesheet",
      type: "text/css",
      href: "${ctx}/statics/styles/index.css"
    });
  })
</script>


  <%--<div class="row">--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail express-link" data-my-exp-simpleName="shunfeng"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/shunfeng.jpg"> <img--%>
              <%--src="http://app2.showapi.com/img/expImg/shunfeng.jpg" alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail express-link" data-my-exp-simpleName="shentong"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/shentong.jpg"> <img--%>
              <%--src="http://app2.showapi.com/img/expImg/shentong.jpg" alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail express-link" data-my-exp-simpleName="yuantong"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/yuantong.jpg" ><img--%>
              <%--src="http://app2.showapi.com/img/expImg/yuantong.jpg" alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail express-link" data-my-exp-simpleName="yunda"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/yunda.jpg"> <img src="http://app2.showapi.com/img/expImg/yunda.jpg"--%>
                                                                                 <%--alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail express-link" data-my-exp-simpleName="zhongtong"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/zto.jpg"> <img src="http://app2.showapi.com/img/expImg/zto.jpg"--%>
                                                                               <%--alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3">--%>
      <%--<a href="#" class="thumbnail  express-link" data-my-exp-simpleName="huitong"--%>
         <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/ht.jpg"> <img--%>
              <%--src="http://app2.showapi.com/img/expImg/ht.jpg" alt="..."></a></div>--%>
    <%--<div class="col-xs-6 col-md-3"><a href="#" class="thumbnail express-link" data-my-exp-simpleName="debang"--%>
                                      <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/dbwl_logo.gif"> <img--%>
            <%--src="http://app2.showapi.com/img/expImg/dbwl_logo.gif" alt="..."></a>--%>
    <%--</div>--%>
    <%--<div class="col-xs-6 col-md-3"><a href="#" class="thumbnail express-link" data-my-exp-simpleName="zhaijisong"--%>
                                      <%--data-my-exp-imgUrl="http://app2.showapi.com/img/expImg/zjs_logo.gif"> <img--%>
            <%--src="http://app2.showapi.com/img/expImg/zjs_logo.gif" alt="..."></a></div>--%>

  <%--</div>--%>



      <table class="company-list">
        <tbody>

        <c:set var="fistLetter" value="A" scope="page"/>
        <tr>
          <td>${fistLetter}</td>
          <td>
            <ul>

              <c:forEach var="company" items="${companyList}" varStatus="index">
              <c:if test="${fn:toUpperCase(fn:substring(company.firstLetterOfName,0,1)) != fistLetter}">
                <c:set var="fistLetter"
                       value="${fn:toUpperCase(fn:substring(company.firstLetterOfName,0,1))}"/>
              <tr>
                <td>${fistLetter}</td>
                <td>
                  <ul>
                    </c:if>
                    <li><a href="javascript:void(0)" class="company-link"
                           data-my-company-id="${company.id}"
                           data-my-company-name="${company.userName}">${company.userName}</a></li>
                    </c:forEach>
                  </ul>
                </td>
              </tr>

        </tbody>
      </table>


